﻿<%@ Page Title="" Language="C#" MasterPageFile="~/master/Attendance.master" AutoEventWireup="true" CodeFile="VerifyTickets.aspx.cs" Inherits="LDAP.Web.View.Attendance.VerifyTickets" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <link rel="stylesheet" href="<%= StaticDomain %>/scripts/util/JqModal/JqPopU.css?r=<%= R %>" />
    <link rel="stylesheet" href="<%= StaticDomain %>/scripts/util/ui_card/ui_card.css?r=<%= R %>" />
    <style type="text/css">
        .niceTab th, .niceTab td {
            line-height: 30px;
            font-size:12px;
            height:auto;
            color:black;
        }
        .kqDetail td, .formDetail td {
            background-color:white;
            padding: 3px 12px; 
            border-top:1px solid #E6E6E6;
        }
        .formDetail td {
            text-align: left;
        }
        .formDetail label {
            display:inline-block; margin-right:16px; line-height:24px;
        }
        .formDetail ol {
            padding-left: 20px;
            margin-bottom:0;
        }
        .formDetail li{
            list-style-position:outside;
        }
        .tipss span {
            color: red;
        }
        .tipss .tipsss {
            padding:0 5px;
            color: black;
        }
        /*
        .popU .crazy,.popU .crazy .bd {
            background: none;
        }*/
    </style>
    
    <script type="text/javascript" src="<%= StaticDomain %>/scripts/util/My97DatePicker/WdatePicker.js?r=<%= R %>"></script>
    <style type="text/css">
        .Wdate {
            height:34px;
        }
        .carousel-inner > .item > img, .carousel-inner > .item > a > img {
            max-height:600px;
        }
    </style>
    <script type="text/javascript" src="<%= StaticDomain %>/scripts/util/JqModal/JqPopU.js?r=<%= R %>"></script>
    <script type="text/javascript" src="<%= StaticDomain %>/scripts/util/ui_card/FixImgSize.js"></script>
    <script type="text/javascript" src="<%= StaticDomain %>/scripts/util/template/trimpath-template.js"></script>
    <script type="text/javascript" src="<%= StaticDomain %>/themes/bootstrap/js/bootstrap.min.js?r=<%= R %>"></script>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <div>
      <nav class="navbar navbar-default" role="navigation">
        <div class="navbar-header">
          <a class="navbar-brand" href="#">选择月份</a>
        </div>
        <div class="collapse navbar-collapse">
          <form class="navbar-form navbar-left" role="search">
            <div class="form-group">
              <input type="text" class="form-control Wdate" value="<%= Year %>年<%= Month.ToString().PadLeft(2,'0') %>月" id="month" onfocus="WdatePicker({skin:'whyGreen',dateFmt:'yyyy年MM月',maxDate:'<%= DateTime.Today.Year %>-<%= DateTime.Today.Month.ToString().PadLeft(2,'0') %>-01'})" />
            </div>
            <button class="btn btn-default" type="button" id="transfer">确定</button>
          </form>
            <% if(ExceptionForm!=null && ExceptionForm.Exists(l=>l.Status==0)){ %>
          <form class="navbar-form">              
            <button class="btn btn-default btn-primary" type="button" id="btnCrazy" style="float:right;">疯狂批单模式</button>
          </form>
            <%} %>
        </div>
      </nav>
    </div>

    <table class="niceTab" cellspacing="0" cellpadding="0" border="0">
        <thead>
            <tr><th>单据号</th><th>单据类型</th><th>异常类型</th><th>提交人</th><th>提交人所属部门</th><th>提交时间</th><th>影响时间</th><th>审批状态</th><th>审批人</th><th>审批时间</th><%--<th>批注</th>--%></tr>
        </thead>
        <tbody id="exfBody">
            <tr><td colspan="11">加载中..</td></tr>
        </tbody>
    </table>

    <textarea name="ticketItem" id="ticketItem" style="display:none;">
        {for l in list}
        <tr>
            <td>@{l.Id}</td>
            <td><a href="javascript:void(0)" onclick="page.showExceptionForm(@{l.Id})">{if l.Type<=11&&l.Type>=9}加班单{else}异常单{/if}</a></td>
            <td>@{showTypeName(l.Type)}</td>
            <td>@{getUserName(l.UserId)}(@{l.UserId})</td>
            <td>@{l.Dept.replace(/;/g,' ')}</td>
            <td>@{l.CreateTime.ToDate().Format("yyyy-MM-dd hh:mm:ss")}</td>
            <td>@{l.ExceptionStartDate.ToDate().Format("yyyy-MM-dd")}{if l.ExceptionEndDate.ToDate() - l.ExceptionStartDate.ToDate() == 0} {else} - @{l.ExceptionEndDate.ToDate().Format("yyyy-MM-dd")}{/if}</td>
            <td>{if l.Status == 100}审批通过{elseif l.Status == 10}<span style="color:red;">审批拒绝</span>{else}<span style="color:gray;">暂未审批</span>{/if}</td>
            <td>@{getAngelName(l.PassUserId)}</td>
            <td>{if l.PassTime != "/Date(-62135596800000+0800)/"} @{l.PassTime.ToDate().Format("yyyy-MM-dd hh:mm:ss")}{/if}</td>
           <%-- <td>{if l.Comment !=null}@{l.Comment.replace(/\n/g,"<br />")}{/if}</td>--%>
        </tr>
        {forelse}
        <tr><td colspan="11">无相关单据</td></tr>
        {/for}
    </textarea>

    <textarea name="formItem" id="formItem" style="display:none;">
        <div class="container" style="max-width:@{width}px">
            <div class="row" style="height:@{height-40}px;">
                <div style="width:306px;float:left;">
                    <div class='ui_card'>
                        <div class='ui_card_photo'><img height='106' width='106' onload='DownImage(this,106,106,1,1)' alt='' src="<%= StaticDomain %>/scripts/util/ui_card/images/default.png" /></div>
                        <div class='ui_card_info'>
                            <div class='ui_card_name'><span class='ui_card_nm'>@{getUserName(UserId)}</span><span class='ui_card_id'>@{UserId}</span></div>
                            <div class='ui_card_content'>@{Dept.replace(/;/g,' ')}</div>
                        </div>
                    </div>
                    <table class="niceTab formDetail" cellspacing="0" cellpadding="0" border="0">
                        <tr>
                            <th style="width:70px">日期</th>
                            {if ExceptionEndDate.ToDate()-ExceptionStartDate.ToDate()!=0}                   
                                <td>@{ExceptionStartDate.ToDate().Format("yyyy-MM-dd")} - @{ExceptionEndDate.ToDate().Format("yyyy-MM-dd")}</td>
                            {elseif}
                                <td>@{ExceptionStartDate.ToDate().Format("yyyy-MM-dd")}</td></tr><%--<tr><th>时段</th><td>{if DurationType ==1}上午{elseif DurationType==2}下午{else}全天{/if}</td>--%>
                            {/if}
                        </tr>
                        <tr><th>异常证明</th><td><ol id="attachShow" style="line-height:24px;"></ol></td></tr>
                        <tr><th style="color:Red">时长</th>
                            <td>
                            {if Duration>=8}
                            <input type="text" class="form-control" value="@{Duration/8}" id="duration" style="display:inline-block;width:50px;"/> 
                            <select id="dayType"><option value="1" selected="selected">天</option><option value="2">小时</option></select>
                            {else}
                            <input type="text" class="form-control" value="@{Duration}" id="duration" style="display:inline-block;width:50px;"/> 
                            <select id="dayType"><option value="1">天</option><option value="2" selected="selected">小时</option></select>
                            {/if}
                            </td>
                        </tr>
                        <tr><th style="color:Red">类型</th><td>@{showTypeSelect(Type)}</td></tr>
                        <tr><th style="color:Red">批注</th><td colspan="3" id="txtComment2"></td></tr>
                    </table>
                </div>
                <div style="width:@{width - 306}px;float:left;">                    
                    <table class="niceTab formDetail" id='record_@{UserId}_@{Id}' cellspacing="0" cellpadding="0" border="0">
                        <tr><th>日期</th><th>班次</th><th>上班</th><th>下班</th></tr>
                    </table>
                </div>
            </div>
            <div class="row">
                <div class="col-md-5">
                    <p><input type="button" class="btn btn-primary btn-lg btn-block" onclick="page.approveTicket(@{Id},100)" style="line-height:48px; font-size:48px;" value="√" /></p>
                </div>
                <div class="col-md-5">
                    <p><input type="button" class="btn btn-danger btn-lg btn-block" onclick="page.approveTicket(@{Id},10)" style="line-height:48px; font-size:48px;" value="×" /></p>
                </div>
                <div class="col-md-2">
                    <p><input type="button" class="btn btn-default btn-lg btn-block" onclick="page.approveTicket(@{Id},-10)" style="line-height:48px; font-size:48px;" value="跳过" /></p>
                </div>
            </div>
        </div>
    </textarea>
    <textarea name="carousel-example" id="carousel-example" style="display:none">
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
                {for o in list}
                <li data-target="#carousel-example-generic" data-slide-to="@{o.count}"></li>
                {/for}
            </ol>
            <div class="carousel-inner">
                {for o in list}
                    <div class="item">
                        <img src="@{o.Path}" alt="@{o.FileName}" onload='DownImage(this, @{width-350},@{height-200},1,1)' />
                    </div>
                {/for}
            </div>
            <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left"></span>
            </a>
            <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right"></span>
            </a>
        </div>
    </textarea>

    <textarea name="demoItem" id="demoItem" style="display:none">
        <table class="niceTab formDetail" cellspacing="0" cellpadding="0" border="0">
            <tr><th>申请人</th><td>@{getUserName(UserId)}</td><th>申请人所属部门</th><td>@{Dept.replace(/;/g,' ')}</td></tr>
            <tr>
                <th>日期</th>
                {if ExceptionEndDate.ToDate()-ExceptionStartDate.ToDate()!=0}                   
                    <td>@{ExceptionStartDate.ToDate().Format("yyyy-MM-dd")} - @{ExceptionEndDate.ToDate().Format("yyyy-MM-dd")}</td>
                {elseif}
                    <td>@{ExceptionStartDate.ToDate().Format("yyyy-MM-dd")}</td><%--<th>时段</th><td>{if DurationType ==1}上午{elseif DurationType==2}下午{else}全天{/if}</td>--%>
                {/if}
                {if Status==0}
                <th>时长</th>
                <td>
                    {if Duration>=8}
                    <input type="text" class="form-control" value="@{Duration/8}" id="duration" style="display:inline-block;width:50px;"/> 
                    <select id="dayType"><option value="1" selected="selected">天</option><option value="2">小时</option></select>
                    {else}
                    <input type="text" class="form-control" value="@{Duration}" id="Text1" style="display:inline-block;width:50px;"/> 
                    <select id="dayType"><option value="1">天</option><option value="2" selected="selected">小时</option></select>
                    {/if}                    
                </td>
                {elseif}
                <th>时长</th><td>@{showTimeTypeName(Duration)}</td>
                {/if}
            </tr>
            <tr><th>类型</th><td colspan="3">{if Status==0}@{showTypeSelect(Type)}{else}@{showTypeName(Type)}{/if}</td></tr>
            <tr><th>异常证明</th><td colspan="3"><ol id="attachShow" style="line-height:24px;"></ol></td></tr>
            {if PassUserId!=null}
            <tr><th>审批人</th><td>@{getAngelName(PassUserId)}</td><th>审批时间</th><td>@{PassTime.ToDate().Format("yyyy-MM-dd hh:mm")}</td></tr>
            {/if}
            <tr>
                <th>审批状态</th>
                <td colspan="3">{if Status==100}审批通过{elseif Status==10}<span style="color:red;">审批拒绝</span>{else}<span style="color:gray;">暂未审批</span>{/if}</td>
            </tr>
            {if Status==0}
            <tr><th>批注</th><td colspan="3" id="txtComment"></td></tr>
            {elseif Comment!=null && Comment!=""}
            <tr><th>批注</th><td colspan="3">@{Comment.replace(/\n/g,'<br />')}</td></tr>
            {/if}
        </table>
    </textarea>

    <script type="text/javascript">
        $(document).ready(function () {
            $("#transfer").click(page.transfer);
            $("#btnCrazy").click(page.crazy);
            page.init();
        });

        var page = {
            uploading: false,
            handler: "/handler/attendanceControl.ashx?action=",

            transfer: function () {
                var date = $("#month").val().match(/\d+/g);
                window.location.href = "/Attendance/MyTickets.aspx?y=" + date[0] + "&m=" + date[1];
                return false;
            },

            init: function () {
                $("#exfBody").html(TrimPath.processDOMTemplate("ticketItem", {list: page.exceptionForm}));
            },

            crazy: function(){
                page.crazyMode= true;

                page.popU = page.popU || new PopU();
                page.popU.initPop({
                    type: 'string',
                    contents: "<div id='crazyFormContainer'></div>",
                    headClass:'crazy',
                    overlayParam:"90",
                    y: 20,
                    w: document.documentElement.clientWidth * 0.9,
                    h: document.documentElement.clientHeight - 80
                    //onNoFn: function(){
                    //    window.location.reload();
                    //},
                    //ShowNoBtnValue: "退出疯狂模式"                  
                });
                page.popU.showPop();

                page.showNextForm();
            },

            showNextForm: function(){
                var o = null;
                $.each(page.exceptionForm, function(i,q){
                    if(q.Status == 0)
                    {
                        o = q;
                        return false;
                    }
                });
                
                var width = document.documentElement.clientWidth * 0.9 - 50;
                var height = document.documentElement.clientHeight - 140;
                if(o==null){
                    $("#crazyFormContainer").html("<p style='font-size:24px;'>都审批完了，无法更棒了！赶紧去买一杯一颗柠檬冰爽一下，冲冲冲~~~</p><iframe style='width:100%;height:"+(height)+"px' src='http://www.85cafe.asia/'></iframe");
                    return false;
                }

                o.width = width;
                o.height = height;
                $("#crazyFormContainer").html(TrimPath.processDOMTemplate("formItem", o));
                if($("#txtComment2").length>0)
                    $("#txtComment2").html("<textarea style='width:100%;' id='txareaComment' rows='5'></textarea>")
                
                $.get(page.handler +"getAttachementInfo", {id: o.Attachement}, function(data){
                    if(data && data.code==1){
                        var photoes = [];
                        var count=0;
                        $.each(data.list, function(i,q){
                            $("#attachShow").append("<li><a target='_blank' href='" + q.Path + "'>" + q.FileName + "</a></li>");
                            q.FileName = q.FileName.toLowerCase();
                            if(q.FileName.endWith(".jpg") ||q.FileName.endWith(".jpeg")||q.FileName.endWith(".png")||q.FileName.endWith(".gif")){
                                q.count = count++;
                                photoes.push(q);
                            }
                        });

                        if(photoes.length>0){
                            $("#record_"+o.UserId+"_"+o.Id).parent().append(TrimPath.processDOMTemplate("carousel-example", {list: photoes, width: width, height: height}));        
                            $(".carousel-indicators li:first").addClass("active");     
                            $(".carousel-inner .item:first").addClass("active");
                            $('.carousel').carousel();
                        }
                        else{
                            $("#record_"+o.UserId+"_"+o.Id).parent().append("无图像附件");
                        }
                    }
                    else{
                        $("#attachShow").parent().html("加载附件异常，请刷新后重试");
                    }
                },"json");

                $.get("/handler/attendanceMgmt.ashx?action=getUserAccessRecord", {userId: o.UserId, startTime: o.ExceptionStartDate.ToDate().Format("yyyy-MM-dd"), endTime: o.ExceptionEndDate.ToDate().Format("yyyy-MM-dd"), r: Math.random()}, function(data){
                    if(data && data.code==1){
                        var html = [];
                        $.each(data.list, function(i,q){
                            q.max = q.max.substring(0,5);
                            q.min = q.min.substring(0,5);
                            var lmax = null;
                            if(i>0 && (new Date(q.date)-new Date(data.list[i-1].date)==86400000))
                                lmax = data.list[i-1].max.split(':')[0];

                            var st = showSchedule(q.date, data.special, data.schedule);
                            html.push("<tr tag='"+q.date+"'><td>"+q.date+"</td><td>"+st.name+"</td><td class='tipss'><span class='tipsss'>"+q.min+"</span><span>"+ showAttendanceStatus(q.min, 1, st.type, lmax) +"</span></td><td class='tipss'><span class='tipsss'>"+q.max+"</span><span>"+showAttendanceStatus(q.max, 2, st.type, lmax, false, q.min)+"</span></td></tr>");                            
                        });
                        $("#record_"+o.UserId+"_"+o.Id).append(html.join(''));
                    }else{
                        $("#attachShow").parent().html("加载考勤信息异常，请刷新后重试");
                    }
                },"json");
            },
            
            showExceptionForm: function(id){
                var match = null;
                $.each(page.exceptionForm, function(i,q){
                    if(q.Id==id){
                        match = q;
                        return false;
                    }
                });

                if(match==null){
                    alert("一定是哪里出什么问题了，刷新页面看看");
                    window.location.reload();
                    return false;
                }
                page.popU = page.popU || new PopU();
                page.popU.initPop({
                    type: 'string',
                    title: "异常单据审批",
                    contents: TrimPath.processDOMTemplate("demoItem", match),
                    w: 650,
                    onYesFn: match.Status==0? function () {
                        page.approveTicket(match.Id, 100);
                    }: undefined,
                    ShowYesBtnValue: "通过",
                    onNoFn: match.Status==0? function(){
                        page.approveTicket(match.Id, 10);
                    }: undefined,
                    ShowNoBtnValue: "拒绝"
                });
                page.popU.showPop();

                $.get(page.handler +"getAttachementInfo", {id: match.Attachement}, function(data){
                    if(data && data.code==1){
                        $.each(data.list, function(i,q){
                            $("#attachShow").append("<li><a target='_blank' href='" + q.Path + "'>" + q.FileName + "</a></li>");                                
                        });
                        if($("#txtComment").length>0)
                            $("#txtComment").html("<textarea style='width:100%;' id='txareaComment' rows='5'></textarea>")
                    }
                    else{
                        $("#attachShow").parent().html("加载附件异常，请刷新后重试");
                    }
                },"json");
            },

            approveTicket: function(id, status){
                if(status==-10){
                    $.each(page.exceptionForm, function(i,q){
                        if(q.Id==id){
                            q.Status = -10;
                            return false;
                        }
                    });
                    var height = document.documentElement.clientHeight - 140;
                    $("#crazyFormContainer").html("<p style='line-height:"+ height +"px;font-size:24px;'>正在加载下一条，假如你没有任何难度的就看到这句话，说明系统有点卡 - - 赶紧告诉三哥，赶紧的</p>");
                    page.showNextForm();
                    return false;
                }

                var comment = $("#txareaComment").val();
                var duration =  $("#duration").length>0? $("#duration").val():0;
                var dt = $("#dayType").val();
                if(dt == 1)
                    duration= duration * 8;
                $.post("/handler/attendanceMgmt.ashx?action=approveTicket", {id: id, type: $("#cra_type").val(), status: status, duration:duration, comment: comment}, function(data){
                    if(data && data.code==1){
                        $.each(page.exceptionForm, function(i,q){
                            if(q.Id==id){
                                q.Status = data.ef.Status;
                                q.PassUserId = data.ef.PassUserId;
                                q.PassTime = data.ef.PassTime;
                                q.Comment = data.ef.Comment;
                                q.Type = data.ef.Type;
                                q.Duration = data.ef.Duration;
                            }
                        });
                        page.init();
                        if(page.crazyMode){
                            var height = document.documentElement.clientHeight - 140;
                            $("#crazyFormContainer").html("<p style='line-height:"+ height +"px;font-size:24px;'>正在加载下一条，假如你没有任何难度的就看到这句话，说明系统有点卡 - - 赶紧告诉三哥，赶紧的</p>");
                            page.showNextForm();
                        }
                        else if(page.popU)
                            page.popU.close();
                    }
                    else{
                        alert("出错了，刷新看看？");
                        window.location.reload();
                    }
                },"json");
            },

            getMousePosition: function (ev) {
                ev = ev || window.event;
                if (ev.pageX || ev.pageY)
                    return { x: ev.pageX, y: ev.pageY };
                else
                    return {
                        x: ev.clientX + document.body.scrollLeft - document.body.clientLeft,
                        y: ev.clientY + document.body.scrollTop - document.body.clientTop
                    };
            }
        };

        page.exceptionForm = <%= ToJson(ExceptionForm) %>;
        page.angelList = <%= ToJson(AngelList) %>;
        
        page.allUser = <%= ToJson(All).ToLower() %>;
    </script>
</asp:Content>